// 获取get传值
function getArgs(){
  var args = {};
  var match = null;
  var search = decodeURIComponent(location.search.substring(1));
  var reg = /(?:([^&]+)=([^&]+))/g;
  while((match = reg.exec(search))!==null){
    args[match[1]] = match[2];
  }
  return args;
}
var getVal=getArgs();
var cid = !isNaN(Number(getVal.cid))?Number(getVal.cid) : 0;
$(function () {
  // ----------设置昵称-------------
  var userName = '';
  while ($('#showusername').text().trim() === '') {
    userName = prompt("请设置你的昵称","");
    $('#showusername').text(userName);
  }
  // ---------创建连接-----------
  var socket = io();
  // 加入房间
  socket.on('connect', function () {
    socket.emit('join', {cid:cid,username:userName});
  });
  // 监听消息
  socket.on('msg', function (uname, msg) {
    showList(uname, msg);
  });
  // 显示消息
  function showList(uname, msg){
    var isme = (userName==uname) ? true : false;
    var contentDiv = ''+msg+'';
    var usernameDiv = ''+uname+'';
    var messageNr = '';
    if(isme){
      messageNr = '<div class="message-nr chat-user"><div class="uname">'+usernameDiv+'</div><div class="clearfix"><div class="txt">'+contentDiv+'</div></div></div>';
    } else {
      messageNr = '<div class="message-nr service"><div class="uname">'+usernameDiv+'</div><div class="clearfix"><div class="txt">'+contentDiv+'</div></div></div>';
    }
    $('#message').append(messageNr);
    // 滚动条保持最下方
    $('#message').scrollTop($('#message')[0].scrollHeight);
  }
  // 获取聊天数据
  $.ajax({
    type: 'post',
    url: '/get-list',
    dataType: 'json',
    data: {cid:cid},
    success:function(data){
      for(var i=data.length;i>0;i--){
        showList(data[i-1].username,data[i-1].content);
      }
    }
  });
  // 监听系统消息
  socket.on('sys', function (sysMsg, users) {
    var message = '<div class="sys-system">' + sysMsg + '</div>';
    $('#message').append(message);
    $('#onlinecount').text('在线人数：'+users.length+'；'+users);
    $('#message').scrollTop($('#message')[0].scrollHeight);
  });
  // 发送消息
  $('#messageInput').keydown(function (e) {
    if (e.which === 13) {
      e.preventDefault();
      var msg = $(this).val();
      $(this).val('');
      socket.send(msg);
    }
  });
  $('#mjr_send').on('click',function(){
    var msg = $('#messageInput').val();
    $('#messageInput').val('');
    socket.send(msg);
  });
  // 退出房间
  $('#joinOrLeave').click(function () {
    if ($(this).text() === '退出') {
      location.reload();
      $(this).text('进入');
      socket.emit('leave');
      var msg = '你已经退出了房间,重新发言请点击"进入房间"';
      $('#message').append('<div class="sysMsg">'+msg+'</div>');
    } else {
      $(this).text('退出');
      socket.emit('join', {cid:cid,username:userName});
    }
  });
  // 右键菜单
  var myMenu=$('#clear-screen'),
      textBox=$('#message');
  // 点击对应右键菜单功能让其知道操作的是哪个列表选项
  myMenu.on('click',function(){
    $('#message .message-nr,#message .sys-system').remove();
  });
  // 在列表项目上右键
  textBox.on('contextmenu',function(e){
    myMenu.show();
    myMenu.css({
      'top':e.pageY+'px',
      'left':e.pageX+'px'
    });
    return false;
  });
  // 点击任意位置让右键菜单消失
  $(document).on('click',function(){
    myMenu.hide();
  });
});